<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>阜安街道智慧党建平台--身份管理</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="assets/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="assets/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="assets/css/app.css">
    <link rel="stylesheet" href="assets/css/main.css">
    <link rel="stylesheet" href="assets/css/style.css">
    <link rel="stylesheet" href="ztree2/css/zTreeStyle/zTreeStyle.css" type="text/css">
    <script src="assets/js/jquery.min.js"></script>
    <script>
        let name = sessionStorage.getItem("username");
        if (name === null) {
            alert("您还未登录，请登录！");
            window.location.href = "login.html";
        }
    </script>
</head>
<body data-type="index">
    <script src="assets/js/theme.js"></script>
    <div class="am-g tpl-g">
<!-- 头部 -->
<div id="personSettings"></div>
<header class="main_header">
    <!-- 右侧内容 -->
    <div class="tpl-header-fluid">
        <!-- 其它功能-->
        <div class="am-fr tpl-header-navbar">
            <ul>
                <!-- 欢迎语 -->
                <li class="am-text-sm tpl-header-navbar-welcome">
                    <a href="javascript:;">欢迎你, <span id="name"></span> </a>
                </li>
                <!--个人设置-->
                <li class="am-text-sm" data-am-modal="{target: '#settings'}" onclick="settings()">
                    <a href="javascript:;">
                        <span class="am-icon-user"></span> 个人设置
                    </a>
                </li>
                <!--退出系统-->
                <li class="am-text-sm" onclick="exit()">
                    <a href="javascript:;">
                        <span class="am-icon-sign-out"></span> 退出系统
                    </a>
                </li>
            </ul>
        </div>
    </div>
</header>
        <!-- 内容区域 -->
        <div class="tpl-content-wrapper">
        <div class="am-panel am-panel-default" id="postId">
            <div class="am-panel-bd" style="display: flex;justify-content: flex-start;align-items: center">
        <a class="flexMenu " href="user.html">
            <img src="assets/img/yhgl.png">
            <p>用户管理</p>
        </a>
                
              
                <a class="flexMenu menu-bg" href="shenfen.html">
                    <img src="assets/img/sfgl.png">
                    <p>角色管理</p>
                </a>
                
                <a class="flexMenu" href="access.html">
                    <img src="assets/img/access.png">
                    <p>权限管理</p>
                </a>
                <a class="flexMenu" href="danwei.html" rules="zuz"> 
                        <img src="assets/img/chuque.png">
                        <p>组织机构</p>
                    </a>
                <a class="flexMenu " href="data_dictionary.html">
                    <img src="assets/img/sjzd.png">
                    <p>积分项管理</p>
                </a>
                <div class="flexMenu" id="backup">
                    <img src="assets/img/backup.png">
                    <p>返回</p>
                </div>
        
            </div>
        
        </div>
            <div class="row-content am-cf">
                <div class="row">
                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <div class="widget am-cf">
                       
                            <div class="widget-body  am-fr">
                                <div class="am-u-sm-6 am-u-md-4 am-u-lg-2">
                                    <button class="am-btn am-btn-sm am-btn-success am-radius add_desc quan_xian" rules="shenfen_add">
                                        添加信息
                                    </button>
                            
                                </div>
                                <div class="am-u-sm-12 am-u-md-12 am-u-lg-3  am-u-lg-offset-6">
                                    <div class="am-input-group am-input-group-sm tpl-form-border-form cl-p">

                                    </div>
                                </div>

                                <div class="am-u-sm-12 am-scrollable-horizontal" style="margin-top: 10px;">
                                    <table width="100%" id="table" class=" am-table-hover am-text-nowrap am-table-bordered am-table-centered am-table am-table-compact am-table-striped tpl-table-black ">
                                        <thead>
                                            <tr>
                                                <th>√</th>
                                                <th>名称</th>
                                                <th>备注</th>
                                                <th>创建时间</th>
                                                <th>状态</th>
                                                <th>操作</th>
                                            </tr>
                                        </thead>
                                        <tbody id="show">

                                            <!-- more data -->
                                        </tbody>
                                    </table>
                                </div>
                                <div class="am-u-lg-12 am-cf">
                                    <div class="am-fl">
                                        <label class="am-fl" style=" margin: 1.5rem 10px;">
                                            <input type="checkbox" name="selectAll" id="checkAll">
                                            全选
                                        </label>
                                        <button class="am-btn am-btn-sm am-btn-danger am-radius am-fl detele quan_xian" rules="shenfen_del">
                                            删除
                                        </button>
                                        <button class="am-btn am-btn-sm am-btn-success am-radius am-fl enable quan_xian" rules="shenfen_qi">
                                            启用
                                        </button>
                                        <button class="am-btn am-btn-sm am-btn-warning am-radius am-fl disable quan_xian" rules="shenfen_jin">
                                            禁用
                                        </button>
                                    </div>
                                    <div class="am-fr">
                                        <ul class="fenye am-pagination tpl-pagination">
                                            <li class="am-active"><a class="first" href="#">首页</a></li>
                                            <li><a href="#" class="up">上一页</a></li>
                                            <li><a href="#" class="down">下一页</a></li>
                                            <li><a class="last" href="#">末页</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="masks"></div>
            <div class="tipbox am-modal-dialog">
                <input type="hidden" id="thisId">
                <label class="am-modal-hd">
                    身份管理
                    <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
                </label>
                <div class="am-input-group">
                    <span class="am-input-group-label">身份名称</span>
                    <input type="text" class="am-form-field name1" placeholder="身份名称(不能为空)" required>
                </div>
                <div class="am-input-group">
                    <span class="am-input-group-label" style="padding:0 32px;">备注</span>
                    <input type="text" class="am-form-field category1" placeholder="备注" required>
                </div>
                <div style="text-align: center;">
                    <button type="submit" class="am-btn am-btn-success am-radius confirm">确认</button>
                        <button type="submit" class="am-btn am-btn-success am-radius confirm2">确认</button>
                    <button type="button" class="am-btn am-btn-default am-radius cancel">取消</button>
                </div>
            </div>
        </div>
    </div>
    <!-- 权限管理 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="qx">
        <div class="am-modal-dialog">
            <div class="am-modal-hd">权限管理
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
                <input type="hidden" id="quan">
            </div>
            <div class="am-modal-bd" style="height: 550px;overflow: auto;">
                    <ul id="treeDemo" class="ztree" style="background-color: #cccccc2e; border-radius: 5px;"></ul>
                    <div style="text-align: center;margin-top: 10px;">
                        <button type="button" onclick="setQuan()" class="am-btn am-btn-success am-radius">确认</button>
                        <button type="button" data-am-modal-close class="am-btn am-btn-default am-radius">取消</button>
                    </div>
            </div>
        </div>
    </div>
    <!-- 模拟弹框alert -->
    <div class="am-modal am-modal-alert" tabindex="-1" id="my-alert">
        <div class="am-modal-dialog">
            <div class="am-modal-bd show_desc">

            </div>
            <div class="am-modal-footer">
                <span class="am-modal-btn">确定</span>
            </div>
        </div>
    </div>
    <script src="assets/js/amazeui.min.js"></script>
    <script src="ztree2/js/jquery.ztree.all.js"></script>
    <script src="assets/js/amazeui.datatables.min.js"></script>
    <script src="assets/js/dataTables.responsive.min.js"></script>
    
    <script>
            let token = sessionStorage.getItem("token");

            var zTreeObj;
            //树节点点击
          function zTreeOnClick(event, treeId, treeNode) {

                //取数据
                $.ajax({
                    url: testurl + "rule/" + treeNode.id,
                    headers: { "Authorization": "Bearer " + token },
                    contentType: "application/json",
                    type: "get",
                    data: {},
                    success: function (data) {
                        //treeId

                        $("#treeId").val(treeNode.id);
                        $("#rule_name").val(data.obj.name);
                        $("#rule_title").val(data.obj.title);

                    }
                });

            }
        // zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解）
        var zNodes = [];
        var setting = {
            callback: {
                onClick: zTreeOnClick
            },
            check: {
                enable: true,
                chkStyle: "checkbox",
                autoCheckTrigger: true,
                chkboxType: { "Y": "ps", "N": "ps" }

            }
        };
        $(function () {
            //页数
            let pages = 1;
            function loadData(pageNum) {
                $.ajax({
                    url: testurl + "/post/list",
                    type: "post",
                    async: false,
                    headers: { "Authorization": "Bearer " + token },
                    contentType: "application/json",
                    data: JSON.stringify({
                        "pageNum": pageNum
                    }),
                    success: function (data) {
                        let data_dictionary = data.obj;

                        ssd = Math.ceil(data.pageTotal / data.pageSize);
                        pages = ssd;
                        str = "";
                
                        $.each(data_dictionary, function (index, values) {
                            if(values.remark === undefined){
                                values.remark = "";
                            }
                            str += " <tr class=\"gradeX\">\n" +
                                "                                        <td>" + "<input name=\"selectAll\" value=" + values.id + " type=\"checkbox\"/>" + "</td>\n" +
                                "                                        <td>" + values.name + "</td>\n" +
                                "                                        <td>" + values.remark + "</td>\n" +
                                "                                        <td>" + values.create_times + "</td>\n" +
                                "                                        <td>" + values.status_name + "</td>\n" +
                                "                                        <td><button class=\"btnImg70 quan_xian\" rules = \"shenfen_guan\" onclick=\"getQuan("+values.id+")\" data-am-modal=\"{target: '#qx'}\">权限管理</button>&nbsp;&nbsp;&nbsp; <button class=\"btnImg60 quan_xian\" rules = \"shenfen_xiu\" onclick=\"rechange("+values.id+")\">修改</button></td>\n" +
                                "                                    </tr>"
                        });
                        $("#show").html(str);
                    }
                });
            }
            loadData(1)
            //分页
            let pageNum = 1;
            $(".first").click(function () {
                pageNum = 1;
                loadData(pageNum);
                $(this).parents("li").addClass("am-active").siblings().removeClass("am-active");
            });
            $(".last").click(function () {
                pageNum = pages;
                loadData(pageNum);
                $(this).parents("li").addClass("am-active").siblings().removeClass("am-active");
            });
            $(".up").click(function () {
                if (pageNum === 1) {
                    return false;
                } else {
                    pageNum--;
                    loadData(pageNum);
                }
                $(this).parents("li").addClass("am-active").siblings().removeClass("am-active");
            });
            $(".down").click(function () {
                if (pageNum === pages) {
                    return false;
                } else {
                    pageNum++;
                    loadData(pageNum);
                }
                $(this).parents("li").addClass("am-active").siblings().removeClass("am-active");
            });
            //删除
            $(".detele").click(function () {
                let checkedLength = "";
                let deletelid = [];
                let ck = document.getElementsByName("selectAll");
                //得到一组checkbox  相当于数组
                //循环这一组checkbox让每一个checkbox选中
                for (let i = 0; i < ck.length; i++) {
                    if (ck[i].checked === true) {//委员选中
                        deletelid.push(ck[i].value);
                        checkedLength = deletelid.length
                    }
                }
                if (checkedLength <= 0) {
                    $(".show_desc").html("选择要删除的内容");
                    $('#my-alert').modal({ target: '#my-alert' });
                    return false;
                } else {
                    if(confirm("确定删除所选信息？")){
                        $.ajax({
                            type: "post",
                            url: testurl + "/post/deletes",
                            contentType: "application/json",
                            headers: { "Authorization": "Bearer " + token },
                            data: JSON.stringify({
                                "ids": deletelid
                            }),
                            success: function (data) {
                                $('#checkAll[name="selectAll"]').removeAttr("checked", false);
                                if (data.success == true) {
                                    $(".show_desc").html(data.message);
                                    $('#my-alert').modal({ target: '#my-alert' });
                                    location.reload()
                                } else {
                                    $(".show_desc").html(data.message);
                                    $('#my-alert').modal({ target: '#my-alert' });
                                    location.reload()
                                }
                            },
                            error: function (data) {
                                $(".show_desc").html(data.message);
                                $('#my-alert').modal({ target: '#my-alert' });
                            }
                        });
                    }
            
                }
            });
            //启用
            $(".enable").click(function () {
                let checkedLength = "";
                let deletelid = [];
                let ck = document.getElementsByName("selectAll");
                //得到一组checkbox  相当于数组
                //循环这一组checkbox让每一个checkbox选中
                for (let i = 0; i < ck.length; i++) {
                    if (ck[i].checked == true) {//委员选中
                        deletelid.push(ck[i].value);
                        checkedLength = deletelid.length
                    }
                }
                if (checkedLength <= 0) {
                    $(".show_desc").html("选择要启用的信息");
                    $('#my-alert').modal({ target: '#my-alert' });
                    return false;
                } else {
                    $.ajax({
                        type: "post",
                        url: testurl + "/post/enables",
                        contentType: "application/json",
                        headers: { "Authorization": "Bearer " + token },
                        data: JSON.stringify({
                            "ids": deletelid,
                            "status": "1"
                        }),
                        success: function (data) {
                            deletelid === []
                            $('input[name="selectAll"]').removeAttr("checked", false);
                            if (data.success === true) {
                                $(".show_desc").html(data.message);
                                $('#my-alert').modal({ target: '#my-alert' });
                                location.reload()
                            } else {
                                $(".show_desc").html(data.message);
                                $('#my-alert').modal({ target: '#my-alert' });
                                location.reload()
                            }
                        },
                        error: function (data) {
                            $(".show_desc").html(data.message);
                            $('#my-alert').modal({ target: '#my-alert' });
                        }
                    });
                }
            });
            //禁用
            $(".disable").click(function () {
                let checkedLength = "";
                let deletelid = [];
                let ck = document.getElementsByName("selectAll");
                //得到一组checkbox  相当于数组
                //循环这一组checkbox让每一个checkbox选中
                for (let i = 0; i < ck.length; i++) {
                    if (ck[i].checked === true) {//委员选中
                        deletelid.push(ck[i].value);
                        checkedLength = deletelid.length
                    }
                }
                if (checkedLength <= 0) {
                    $(".show_desc").html("选择要禁用的信息");
                    $('#my-alert').modal({ target: '#my-alert' });
                    return false;
                } else {
                    $.ajax({
                        type: "post",
                        url: testurl + "/post/enables",
                        contentType: "application/json",
                        headers: { "Authorization": "Bearer " + token },
                        data: JSON.stringify({
                            "ids": deletelid,
                            "status": "2"
                        }),
                        success: function (data) {
                            $('input[name="selectAll"]').removeAttr("checked", false);
                            if (data.success === true) {
                                $(".show_desc").html(data.message);
                                $('#my-alert').modal({ target: '#my-alert' });
                                location.reload()
                            } else {
                                $(".show_desc").html(data.message);
                                $('#my-alert').modal({ target: '#my-alert' });
                                location.reload()
                            }
                        },
                        error: function (data) {
                            $(".show_desc").html(data.message);
                            $('#my-alert').modal({ target: '#my-alert' });
                        }
                    });
                }
            });
            //添加
            $(".add_desc").click(function () {
                $(".tipbox,.masks").show();
                $(".thisId").val("")
            })
            $(".cancel,.am-close").click(function () {
                $(".name1").val("");
                $(".code1").val("");
                $(".category1").val("");
                $(".value1").val("");
                $(".sort1").val("");
                $(".state1").val("");
                $(".tipbox,.masks").hide();
                $(".confirm2").hide();
                $(".confirm").show();
            })
            $(".confirm").click(function () {
                let name1 = $(".name1").val().trim();
             
                let category1 = $(".category1").val().trim();
                if (name1 === "") {
                    alert("身份名称不能为空");
                    return false;
                }
               
                $.ajax({
                    url: testurl + "/post/add",
                    type: "post",
                 
                    headers: { "Authorization": "Bearer " + token },
                    contentType: "application/json",
                    data: JSON.stringify({
                        "name": name1,//名称
                        "remark": category1//备注
                    }),
                    success: function (data) {
   
                        if (data.success === true) {
                            $(".tipbox,.masks").hide();
                            $(".name1").val("");
                            $(".category1").val("");
                            $(".value1").val("");
                            $(".sort1").val("");
                            $(".state1").val("");
                            $(".show_desc").html(data.message);
                            $('#my-alert').modal({ target: '#my-alert' });
                        }
                        else {
                            $(".show_desc").html("添加失败");
                            $('#my-alert').modal({ target: '#my-alert' });
                        }
                        location.reload();

                    }
                });
            });
            $(".confirm2").click(function(){
                let id = $("#thisId").val();
                 let name = $(".name1").val().trim();
                let category = $(".category1").val().trim();
                if (name === "") {
                    alert("身份名称不能为空");
                    return false;
                }
                $.ajax({
                    url: testurl + "/post/update",
                    type: "post",
                    headers: { "Authorization": "Bearer " + token },
                    contentType: "application/json",
                    data: JSON.stringify({
                        "id":id,
                        "name": name,//名称
                        "remark": category//备注
                    }),
                    success: function (data) {
                        if (data.success === true) {
                            $(".tipbox,.masks").hide();
                            $(".name1").val("");

                            $(".category1").val("");
                            $(".value1").val("");
                            $(".sort1").val("");
                            $(".state1").val("");
                            $(".show_desc").html(data.message);
                            $('#my-alert').modal({ target: '#my-alert' });
                        }
                        else {
                            $(".show_desc").html("更新失败");
                            $('#my-alert').modal({ target: '#my-alert' });
                        }
                        location.reload();

                    }
                })
            })
            //选中所有的checkbox框
            $('#checkAll[name="selectAll"]').click(function () {
                if ($(this).is(':checked')) {
                    //let deletelid1=[]
                    $('#show input[name="selectAll"]').each(function (i) {
                        //此处如果用attr，会出现第三次失效的情况
                        $(this).prop("checked", true);
          
                    });
                } else {
                    $('input[name="selectAll"]').each(function () {
                        $(this).removeAttr("checked", false);
           
                    });
                }
            });



          

        });
        function getQuan(id){
            $("#quan").val(id);
            //获取树节点
            $.ajax({
                async: false,
                url: testurl + "/rule/tree",
                headers: { "Authorization": "Bearer " + token },
                type: "get",
                contentType: "application/json",
                data: {},
                success: function (data) {
                    zNodes = data.obj;
                }
            });
            zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, JSON.parse(zNodes));
            let aaa = "";
            $.ajax({
                async: false,
                url: testurl + "/post/detail",
                type: "post",
                headers: { "Authorization": "Bearer " + token },
                contentType: "application/json",
                data: JSON.stringify({"id":id}),
                success: function (data) {
                    var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
                    aaa = data.obj.rules;
                    let bbb =  aaa.split(",");
                    for (var i = 0, l = bbb.length; i < l; i++) {
                        treeObj.checkNode(treeObj.getNodeByParam("id",bbb[i]),true);
                    }
      
                }
            })
        }

//设置权限
function setQuan(){
    let id = $("#quan").val();
    let rule = [];
    let treeObj = $.fn.zTree.getZTreeObj("treeDemo");
    var nodes = treeObj.getCheckedNodes(true);
     for (var i = 0; i < nodes.length; i++) {
         rule.push(nodes[i].id);
    }
    let rules = rule.toString();
    $.ajax({
        url: testurl + "post/grant_rules",
        type: "post",
        headers: { "Authorization": "Bearer " + token },
        contentType: "application/json",
        data: JSON.stringify({
            "id": id,
            "rules": rules
        }),
        success:function(data){
       
            $('#qx').modal({ target: '#my-alert' });
            alert(data.message);
            location.reload()
        }
    })
}
//修改
function rechange(e){
    $(".tipbox,.masks").show();
    $(".confirm2").show();
    $(".confirm").hide();
    $("#thisId").val(e);
     $.ajax({
        url: testurl + "/post/detail",
        type: "POST",
        async: false,
        headers: { "Authorization": "Bearer " + token },
        contentType: "application/json",
        data: JSON.stringify({
            "id": e,
        }),
         success:function(data){
             $(".name1").val(data.obj.name);
             $(".category1").val(data.obj.remark);
         }
     })
}
    </script>
    <script src="assets/js/app.js"></script>
</body>

</html>